<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <!--{include file='comm/header.tpl'}-->
    <!--{include file='comm/comm_editor.tpl'}-->
    <!--{include file='comm/comm_region.tpl'}-->
    <title>收货地址精度列表</title>
</head>
<body>
<!--{include file='comm/naviBanner.tpl'}-->
<div class="container">

    <!--{include file='comm/menu.tpl'}-->


        <div class="comm_crub">
            <span class="now_crub">收货地址精度列表</span>
        </div>

        <div class="comm_content">

            <div class="search-box" style="margin-top:10px;">
                <div style="position:relative">
                    <form id="searchForm" class="form-inline" onsubmit="return false;">
                        <table style="width:100%;">
                            <tbody>
                            <tr>
                                <td height="27px" style="width:15%;">

                                    收货地址：<input id="address" class="form-control input-sm w300" type="text" name="address" value="">

                                    &nbsp;

                                 省名：
                                    <select class="form-control " id="oneLevelID" name="provinceid" style="width: 100px;margin-right: 5px;">
                                        <option value="">请选择</option>
                                    </select>
                                 市名：
                                    <select class="form-control " id="secondLevelID" name="cityid" style="width: 100px;margin-right: 5px;">
                                        <option value="">请选择</option>
                                    </select>
                                 区名：
                                    <select class="form-control " id="threeLevelID" name="countyid" style="width: 100px;">
                                        <option value="">请选择</option>
                                    </select>



                                 精确度范围：
                                    <select class="form-control " id="precise" name="precise" style="width: 100px;">
                                        <option value="">请选择</option>
                                        <option value="0">大于1</option>
                                        <option value="1">等于1</option>
                                    </select>

                                    <input type="button" value="查询" id="searchBtn" style="cursor: pointer;" class="btn btn-primary" onclick="address_precision.search();" />

                                    &nbsp;

                                    <input type="button" value="重置" id="clearBtn" style="cursor: pointer;" class="btn btn-warning" onclick="address_precision.clear();" />

                                </td>
                            </tr>

                            </tbody>
                        </table>
                    </form>
                </div>
            </div>

            <table id="flex" style="display:none"></table>

        </div>


    <!--{include file='comm/footer.tpl'}-->

</div>


<div id="pop" style="display: none;">

    <form id="item_form" onsubmit="return false;" class="form-horizontal">


        <div class="form-group">
            <label class="col-sm-2 control-label" for="address_detail">
                <span class="red">*</span>
                地址：
            </label>
            <div class="col-sm-10">
                <p class="form-control-static fl" id="address_detail"></p>
                <input type="hidden" name="deliverID" id="deliver_id" value="">
            </div>
        </div>


        <div class="form-group map" >
            <label class="col-sm-2 control-label" for="longitude">
                <span class="red">*</span>
                经度：
            </label>
            <div class="col-sm-10">
                <input id="longitude" class="form-control w300" type="text" name="longitude" readonly="readonly" value="">
            </div>
        </div>

        <div class="form-group map">
            <label class="col-sm-2 control-label" for="latitude">
                <span class="red">*</span>
                纬度：
            </label>
            <div class="col-sm-10">
                <input id="latitude" class="form-control w300" type="text" name="latitude" readonly="readonly" value="">
            </div>
        </div>

        <div class="form-group map" id="map_tr">
            <label class="col-sm-2 control-label" for="latitude">

            </label>
            <div class="tar"></div>
            <div class="col-sm-10" style="height:210px; padding-bottom:5px;">
                <div id="allmap" style="height:200px; width:600px;"></div>
            </div>

        </div>

    </form>
</div>


<script type="text/javascript" src="/framework/ebsig/js/region.min.js"></script>
<script type="text/javascript" src="/framework/ebsig/js/region.change.min.js"></script>
<!--baidu map-->
<!--{include file="comm/baidu_map.tpl"}-->

<script type="text/javascript">
    $("#flex").flexigrid({
        url:"/invokingAjax-backend/system/addressPrecision.ajax?operFlg=1",
        dataType: "json",
        colModel : [
            <!--{if $edit_permission}-->
            {display: "操作", width : 100, align: "center"},
            <!--{/if}-->
            {display: "地址", width : 300},
            {display: "经度", width : 150},
            {display: "纬度", width : 200},
            {display: "精确度", width : 100}
        ],

        sortname: "createTime",
        sortorder: "desc",
        usepager: true,
        rp: 10,
        useRp: true,
        showTableToggleBtn: true,
        onSubmit: function() {
            var dt = $('#searchForm').serializeArray();
            $("#flex").flexOptions({params: dt});
            return true;
        }
    });

    var address_precision = {

        //搜索
        search: function() {
            var dt = $('#searchForm').serializeArray();
            $("#flex").flexOptions({newp: 1, params: dt}).flexReload();
        },


        //获得编辑信息 打开弹出层
        edit: function( deliverID, longitude, latitude, address) {

            $('#deliver_id').val(deliverID);
            $('#longitude').val(longitude);
            $('#latitude').val(latitude);
            $('#address_detail').text(address);

            E.popup.open({
                id: "pop",
                title: name,
                css: "width:960px;",
                btnName: "保存",
                btnCall:"address_precision.check();"
            });

            showMap( address );

        },

        //字段校验
        check: function() {

            this.dt = E.getFormValues('item_form');

            this.dt.provinceName = this.dt.provinceid != "" ? $("#oneLevelID option:selected").text() : '';
            this.dt.cityName = this.dt.cityid != "" ? $("#secondLevelID option:selected").text() : '';
            this.dt.countyName = this.dt.countyid != "" ? $("#threeLevelID option:selected").text() : ''

            var error_msg = '';

            if(E.isEmpty(this.dt.longitude)){
                error_msg +="经度信息不能为空<br>";
            }

            if(E.isEmpty(this.dt.latitude)){
                error_msg +="纬度信息不能为空<br>";
            }

            if (error_msg != '') {

                E.alert(error_msg);

            } else {

                E.confirm("您确认要修改收货地址信息？", function() {

            //this.dt.address = $("#provinceName").text();

                    E.loadding.open('正在保存，请稍候...');

                    E.ajax_post({
                        url:  '/invokingAjax-backend/system/addressPrecision.ajax?operFlg=100&act=edit',
                        data: address_precision.dt,
                        call: function( o ) {
                            E.loadding.close();
                            if (o.code == 200) {
                                address_precision.load();
                                E.alert(o.message, 2, "E.popup.close");
                            } else {
                                E.alert(o.message);
                            }
                        }
                    });
                });
            }
        },

        //重置
        clear: function() {

            $("#address").val('');
            $("#oneLevelID").val('');
            $("#secondLevelID").val('');
            $("#threeLevelID").val('');
            $("#deliverID").val('');
            $("#precise").val('');
            address_precision.load();

        },

        //重新加载
        load: function() {
            $("#flex").flexReload();
        }

    };

    //显示省市区
    E.region.init({
        p: 'oneLevelID',
        c: 'secondLevelID',
        a: 'threeLevelID'

    });

    //百度地图显示
    function showMap ( address ) {

        var map = new BMap.Map("allmap");
        map.addControl(new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL}));
        var myGeo = new BMap.Geocoder();

        myGeo.getPoint( address, function(point){
            if(point){
                var lng = $('#longitude').val();
                var lat = $('#latitude').val();
                if((lng != '') && (lat !='') && (parseInt(lng)!=0)&& (parseInt(lat)!=0)){
                    var point = new BMap.Point(lng, lat);
                }else{
                    $('#longitude').val(point.lng);
                    $('#latitude').val(point.lat);
                }
                map.centerAndZoom(point, 18);
                var marker = new BMap.Marker(point);


                //开启坐标点拖拽属性
                marker.enableDragging();

                //在地图上设置坐标点
                map.addOverlay(marker);
                //marker下坠效果
                marker.setAnimation(BMAP_ANIMATION_DROP);

                //设置信息窗口
                var opts = {
                    width : 0,     // 信息窗口宽度
                    height: 0,     // 信息窗口高度
                    enableMessage:false,
                    enableCloseOnClick:false,
                    title : "<span style='color:red;font-weight:bold;'>位置不对吗？？</span>"  // 信息窗口标题
                };
                var html = '<div class="infoWindow_content">快来拖动此图标到达正确位置</div>';
                var infoWindow = new BMap.InfoWindow(html,opts);
                marker.openInfoWindow(infoWindow);

                //开始拖拽
                marker.addEventListener("dragstart", function(e){
                    marker.closeInfoWindow(infoWindow);
                });

                //结束拖拽
                marker.addEventListener("dragend", function(e){
                    myGeo.getLocation(e.point, function(rs){
                        $('#longitude').val(e.point.lng);
                        $('#latitude').val(e.point.lat);
                    });
                });
            }
        });

    }
</script>

</body>

</html>
